﻿<div ng-init="currentTab='events'" ng-include="'Views/Menu/NewsCalendarEventMenu.html'"></div>

<div class="title-bold" style="font-size: 16px;">
    <p ng-show="eventAddEdit.isAddMode">Add Event</p>
    <p ng-show="!eventAddEdit.isAddMode">Event Details</p>
</div>


<div class="container-fluid">
    <div class="row">
        <form  role="form" name="form" novalidate>

            <div class="form-horizontal col-md-5">
              
                <!--Event name-->
                <div class="form-group" ng-class="{ 'has-error' : form.name.$invalid && (!form.name.$pristine || eventAddEdit.submitted) }">
                    <label class="inp-control-label col-sm-3 control-label">
                        Event Name*
                    </label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" placeholder="Event Name" name="name"
                               ng-model="eventAddEdit.currentEvent.name" ng-maxlength="200" required sn-server-error ng-disabled="eventAddEdit.isEditDisabled">
                        <p class="help-block" ng-if="form.name.$error.required && (!form.name.$pristine || eventAddEdit.submitted)">The field is required.</p>
                        <p class="help-block" ng-if="form.name.$error.maxlength">The text must be at most 200 characters long</p>
                        <p class="help-block" ng-show="form.name.$error.server">{{errors.name}}</p>
                    </div>
                </div>

                <!--Event Location-->
                <div class="form-group" ng-class="{ 'has-error' : form.location.$invalid && (!form.location.$pristine || eventAddEdit.submitted) }">
                    <label class="inp-control-label col-sm-3 control-label">
                        Event Location*
                    </label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" placeholder="Location" name="location"
                               ng-model="eventAddEdit.currentEvent.location" ng-maxlength="100" required sn-server-error ng-disabled="eventAddEdit.isEditDisabled">
                        <p class="help-block" ng-if="form.location.$error.required && (!form.location.$pristine || eventAddEdit.submitted)">The field is required.</p>
                        <p class="help-block" ng-if="form.location.$error.maxlength">The text must be at most 100 characters long</p>
                        <p class="help-block" ng-show="form.location.$error.server">{{errors.location}}</p>
                    </div>
                </div>


                <!--Start Date-->
                <div class="form-group" ng-class="{ 'has-error' : form.startDate.$invalid && (!form.startDate.$pristine || eventAddEdit.submitted) }">
                    <label class="inp-control-label  col-sm-3 control-label">
                        Start Date*
                    </label>
                    <div class="col-sm-8">
                        <input class="form-control" name="startDate" type="text" datepicker-popup="MM/dd/yyyy" placeholder="MM/DD/YYYY" datepicker-localdate
                               ng-model="eventAddEdit.currentEvent.startDate" ng-required="true" sn-server-error ng-disabled="eventAddEdit.isEditDisabled" is-open="eventAddEdit.startDateOpen" ng-click="eventAddEdit.startDateOpen = true">
                        <p class="help-block" ng-if="form.startDate.$error.required && (!form.startDate.$pristine || eventAddEdit.submitted)">Please enter the date as MM/DD/YYYY.</p>
                        <p class="help-block" ng-show="form.startDate.$error.server">{{errors.startDate}}</p>
                    </div>
                </div>


                <!--End Date-->
                <div class="form-group" ng-class="{ 'has-error' : form.endDate.$invalid && (!form.endDate.$pristine || eventAddEdit.submitted) }">
                    <label class="inp-control-label col-sm-3 control-label">
                        End Date*
                    </label>
                    <div class="col-sm-8">
                        <input class="form-control" name="endDate" type="text" datepicker-popup="MM/dd/yyyy" placeholder="MM/DD/YYYY" datepicker-localdate
                               ng-model="eventAddEdit.currentEvent.endDate" ng-required="true" sn-server-error ng-disabled="eventAddEdit.isEditDisabled" is-open="eventAddEdit.endDateOpen" ng-click="eventAddEdit.endDateOpen = true">
                        <p class="help-block" ng-if="form.endDate.$error.required && (!form.endDate.$pristine || eventAddEdit.submitted)">Please enter the date as MM/DD/YYYY.</p>
                        <p class="help-block" ng-show="form.endDate.$error.server">{{errors.endDate}}</p>
                    </div>
                </div>


                <!--Event Presenter-->
                <div class="form-group" ng-class="{ 'has-error' : form.presenter.$invalid && (!form.presenter.$pristine || eventAddEdit.submitted) }">
                    <label class="inp-control-label col-sm-3 control-label">
                        Presenter
                    </label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" placeholder="Presenter" name="presenter"
                               ng-model="eventAddEdit.currentEvent.presenter" ng-maxlength="100" sn-server-error ng-disabled="eventAddEdit.isEditDisabled">
                        <p class="help-block" ng-if="form.presenter.$error.maxlength">The text must be at most 100 characters long.</p>
                        <p class="help-block" ng-show="form.presenter.$error.server">{{errors.presenter}}</p>
                    </div>
                </div>


                <!--Sponsorship-->
                <div class="form-group">
                    <label class="inp-control-label  col-sm-3 control-label">
                        Sponsorship
                    </label>
                    <div class="col-sm-8" style="margin-top:10px">
                        <div style="float: left; padding-right: 10px;">
                            <input type="radio" name="radiog_lite" id="radio1" class="css-checkbox" ng-value="true" ng-model="eventAddEdit.currentEvent.sponsorship" ng-disabled="eventAddEdit.isEditDisabled" />
                            <label for="radio1" class="css-label radGroup1">YES</label>
                        </div>
                        <div style="float: left; padding-right: 10px;">
                            <input type="radio" name="radiog_lite2" id="radio2" class="css-checkbox" ng-value="false" ng-model="eventAddEdit.currentEvent.sponsorship" ng-disabled="eventAddEdit.isEditDisabled" />
                            <label for="radio2" class="css-label radGroup1">NO</label>
                        </div>
                    </div>
                </div>
              
            </div>
           
            
            

            <div style="float:left" class="col-xs-11 col-md-6" ng-class="{ 'has-error' : form.body.$invalid && eventAddEdit.submitted }">
                <div id="eventSummary" name="body" required class="editor-field" text-angular ng-model="eventAddEdit.currentEvent.body" ng-maxlength="5000" required
                     ta-toolbar="[['h1','h2','h3'],['p','bold','italics','underline'],['insertLink'],['html']]"
                     ta-disabled="eventAddEdit.isEditDisabled">
                </div>
                <div style="min-height:20px; margin-top:5px;margin-bottom:10px">
                    <p style="margin:0px" class="help-block" ng-show="form.body.$invalid && eventAddEdit.submitted">This field is required</p>
                </div>
            </div>
            <br/>
            <div class="col-xs-11 col-md-11" style="padding-top:10px">
                <button class="btn-green" style="width: 151px; margin-right: 10px;" ng-click="eventAddEdit.publish()" ng-disabled="eventAddEdit.isEditDisabled">Publish</button>
                <button class="btn-green" style="margin-right: 10px;" ng-click="eventAddEdit.saveAsDraft()" ng-disabled="eventAddEdit.isEditDisabled">Save as Draft</button>
                <button class="btn-green" style="width: 151px;" ng-click="eventAddEdit.cancel()">Cancel</button>
            </div>
           
        </form>
    </div>

</div>
